<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<style type="text/css">
</style>
<div class="breadcrumbs" id="breadcrumbs">
	<ul class="breadcrumb">
		<li><i class="ace-icon fa fa-home home-icon"></i> <a href="index">主页</a>
		</li>
		<li><span>控制台</span>
		</li>
	</ul>
</div>
<div class="page-content">
	<div class="table-header">部门管理</div>
	<div class="row">
		<div class="col-xs-12">
			<div id="dynamic-table_wrapper"
				class="dataTables_wrapper form-inline no-footer">
				<div class="zTreeDemoBackground col-xs-3">
					<a class="btn btn-sm btn-info" href="javascript:abclick(-1)">查看全部的用户</a>
					<ul id="treeDemo" class="ztree"></ul>
				</div>
				<div class="col-xs-9">

					<table
						class="table table-striped table-bordered table-hover dataTable no-footer DTTT_selectable"
						id="dynamic-table" role="grid"
						aria-describedby="dynamic-table_info">
						<thead>
							<tr>
								<th class="col-xs-1">用户名</th>
								<th class="hidden-480 col-xs-2">职位</th>
								<th class="col-xs-2">角色</th>
								<th class="col-xs-2">状态</th>
							</tr>
						</thead>

						<tbody id="deptpage">
						</tbody>
					</table>
					<div class="row">
						<div class="col-xs-12 col-md-12">
							<div class=" pull-left">
								<label>显示<select name="dynamic-table_length"
									aria-controls="dynamic-table" class="form-control input-sm" id="sel"><option
											value="10">10</option>
										<option value="20">20</option>
										<option value="50">50</option>
										<option value="100">100</option>
								</select> 条记录</label>
							</div> 

							<div class="dataTables_paginate paging_simple_numbers">
										<ul class="pagination" id="get_pagination3">
										</ul>
										<div class="laypage_main laypageskin_molv" id="laypage_3">
											<span class="laypage_curr" style="background-color:#2283C5">1</span><span
												class="laypage_total"><label>到第</label><input max="1"
												min="1" class="laypage_skip" type="number"><label>页</label>
												<button type="button" class="laypage_btn">
													确定
													</button>
											</span>
										</div>
									</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<div class="hidden" id="addqx">
	<div class="col-xs-1"></div>
	<div class="col-xs-10">
		<form id="adx" action="dept/upprivi" method="post">
			<div class="col-xs-12">
				<div class="control-group">
					<label class="control-label bolder blue">权限更改</label> <input
						type="hidden" name="dept_id" id="dept_id"><input
						type="hidden" name="dept_name" id="dept_name"> <input
						type="hidden" name="privilege_id" id="pri2_id">
					<div class="zTreeDemoBackground left">
						<ul id="treeDemo2" class="ztree"></ul>
					</div>
					
				</div>
			</div>

		</form>
	</div>
	<div class="col-xs-1"></div>
</div>
<div class="hide" id="add">

	<form id="pform" action="" method="post">


		<div class="col-xs-4">
			<div class="control-group">
				<label class="control-label bolder blue">权限选择</label> <input
					type="hidden" name="dept.dept_id" id="dept_id"> <input
					type="hidden" name="dept.prent_id" id="p_id"> <input
					type="hidden" name="privilege_id" id="pri_id">
				<div class="zTreeDemoBackground left">
					<ul id="treeDemo1" class="ztree"></ul>
				</div>
			</div>
		</div>
		<div class="form-group col-xs-8">
			<label class="control-label bolder blue col-xs-12">部门信息</label>
			<div class="col-xs-12">
				<label class="col-sm-3 control-label no-padding-right"
					for="form-field-1">部门名称</label>
				<div class="col-sm-9">
					<input type="text" class="form-control" name="dept.dept_name"
						id="str1" value="" />
				</div>
			</div>
			<div class="col-xs-12">
				<label class="col-sm-3 control-label no-padding-right"
					for="form-field-1">部门状态</label>

				<div class="col-sm-9">
					<select name="dept.status" aria-controls="dynamic-table"
						class="form-control"><option value="1">启用</option>
						<option value="0">禁用</option>
					</select>
				</div>
			</div>
		</div>
	</form>
</div>

<!-- 更改每页显示数据的数目 -->
<script type="text/javascript">
	var sel=document.getElementById("sel");
sel.onchange=function(){
/* alert(sel.options[sel.selectedIndex].value); */
		$.post("dept/gghs", {"pagen" :sel.options[sel.selectedIndex].value}, function(data) {
			pagedemo(1);							
		});
}
</script>

<script type="text/javascript">
	function pageO(data){
			if(data.totalPage!=1){
				$("#laypage_3").addClass("hide");
				$("#get_pagination3").removeClass("hide");
				laypage({
				cont : $('#get_pagination3'), //容器。值支持id名、原生dom对象，jquery对象,
				pages : data.totalPage, //总页数
				skip : true, //是否开启跳页
				skin : '#2283C5',//保持ace中间的样式
				first: 1,
				last : data.totalPage, //总页数，将尾页显示为总页数
				curr : data.pageNumber,//当前页
				groups : 5, //连续显示分页数
				jump : function(obj, first) {
					if (!first) { //一定要加此判断，否则初始时会无限刷新
						pagedemo(obj.curr);
					}
					}
				});
			}else{
				$("#get_pagination3").addClass("hide");
				$("#laypage_3").removeClass("hide");
			}
	}

pagedemo(1);
	function pagedemo(n) {
		$.get("dept/pagedemo", {
			"pageNumber" : n
		}, function(data) {
			packlist(data);
			pageO(data[0].list);
		});
	}

	function pack(data) { //填充数据
		var dataStr = "";
		$.each(data, function(i, v) {
			dataStr += packlist(v);
		});
		$("#deptpage").html(dataStr);
	}

	function packlist(data) {
		var dataStr = "";
		$.each(data, function(i, d) {
		$.each(d.list.list, function(i, v) {
		dataStr += '<tr>';
		dataStr += '<td>' + v.name+ '</td>';
		dataStr += '<td>' + v.position + '</td><td>';
		if(v.parent_id==0){dataStr += '无';}
		$.each(d.roles, function(i, p) {
			if(p.role_id==v.role_id) dataStr += p.role_name;
			
		});
		dataStr += '</td><td>';
		if (v.status == true) {
			dataStr += '<span class="label label-sm label-success">';
			dataStr += '启用';
			dataStr += '</span>';
		} else {
			dataStr += '<span class="label label-sm label-inverse arrowed-in">停用</span>';
		}
		dataStr += '</td>';
		dataStr += '</tr>';
		});});
		$("#deptpage").html(dataStr);
		
	};

	$("#selectfromsb").click(function() {
		$.post("dept/sele", $("#selefrom").serialize(), function(data) {
			packlist(data);
		})
		return false;
	});





/* 	function addFrom() {
		document.getElementById("pform").reset();
		$('#add').removeClass("hide");
		userModel = layer.open({
			type : 1,
			shade : [ 0.5 ],
			title : '添加部门',
			area : [ '30%', '300px' ],
			content : $('#add'), //捕获的元素
			btn : [ '提交', '取消' ],
			yes : function(index, layero) { //或者使用btn1
				$.post("dept/add", $("#pform").serialize(), function(data) {
					layer.close(index);
					$('#add').addClass("hide");
				});

			},
			cancel : function(index) {
				layer.close(index);
				$('#add').addClass("hide"); //取消继续隐藏
			},
		});
	}; */

	var setting = {
		async : {
			enable : true,

		},
		view : {
			expandSpeed : "",
			addHoverDom : addHoverDom,
			removeHoverDom : removeHoverDom,
			selectedMulti : false,
			showIcon:true      /* 不现实结点图片 */
		},
		edit : {
			enable : true,
			showRemoveBtn: showRemoveBtn,
			removeTitle:"删除部门",
			renameTitle:"部门修改",
			editNameSelectAll:false
		},
		data : {
			simpleData : {
				enable : true
			}
		},
		callback : {
			beforeRemove : beforeRemove,
			beforeRename : beforeRename
		}
	};
	var zNodes = ${strList};
	
	function beforeRemove(treeId, treeNode) { 
	 $("#dept_id").val(treeNode.id);
    	if(confirm("确认删除" + treeNode.name + "部门吗？")){
    	     //alert(treeNode.id)
    		 //window.location.href = "/dept/del?id="+treeNode.id;
    		 $.post("dept/del", {	"id" : treeNode.id}, function(data) {
				pagedemo(1);
			});
    	}else{
    		return false;
    	}
    }
   
	function beforeRename(treeId, treeNode, newName) {
		$("#dept_name").val(newName);
		$("#dept_id").val(treeNode.id);
		document.getElementById("adx").reset();
		$('#addqx').removeClass("hidden");
		userMode = layer.open({
			type : 1,
			shade : [ 0.5 ],
			title : '权限更改', //不显示标题
			area : [ '20%', '500px' ], //显示空间
			content : $('#addqx'), //捕获的元素
			btn : [ '添加', '取消' ],
			yes : function(index, layero) { //或者使用btn1
				$.post("addqx", $("#adx").serialize(), function(data) {
					layer.close(index);
					$('#addqx').addClass("hidden");
					document.getElementById("adx").submit();
				});
			},
			cancel : function(index) {
				layer.close(index);
				$('#addqx').addClass("hidden"); //取消继续隐藏
			},
		});

				var setting = {
 			callback: {
		onCheck: zTreeOnCheck
	}, 
			check: {
				enable: true
			},
			data: {
				simpleData: {
					enable: true
				}
			}
		};

		var zNodes =${privilegelist};
		
		var code;
		
		function setCheck() {
			var zTree = $.fn.zTree.getZTreeObj("treeDemo2"),
			type = { "Y":"ps", "N":"ps"};
			zTree.setting.check.chkboxType = type;
		}
		function showCode(str) {
			if (!code) code = $("#code");
			code.empty();
			code.append("<li>"+str+"</li>");
		}
		
		$(document).ready(function(){
			$.fn.zTree.init($("#treeDemo2"), setting, zNodes);
			setCheck();
		});
		
	var objval='';
			function zTreeOnCheck(event, treeId, treeNode) {
		   var treeObj = $.fn.zTree.getZTreeObj("treeDemo2");
			 var nodes = treeObj.getCheckedNodes(true);  
 				
 				$.each(nodes,function(i,v){
 				objval+=v.id+",";
 				});
 				$("#pri2_id").val(objval);
 				objval='';
			}; 


	}

	var newCount = 1;
	function addHoverDom(treeId, treeNode) {
		var setting = {
 			callback: {
		onCheck: zTreeOnCheck
	}, 
			check: {
				enable: true
			},
			data: {
				simpleData: {
					enable: true
				}
			}
		};

		var zNodes =${privilegelist};
		
		var code;
		
		function setCheck() {
			var zTree = $.fn.zTree.getZTreeObj("treeDemo1"),
			type = { "Y":"ps", "N":"ps"};
			zTree.setting.check.chkboxType = type;
		}
		function showCode(str) {
			if (!code) code = $("#code");
			code.empty();
			code.append("<li>"+str+"</li>");
		}
		
		$(document).ready(function(){
			$.fn.zTree.init($("#treeDemo1"), setting, zNodes);
			setCheck();
		});
		
	var objval='';
			function zTreeOnCheck(event, treeId, treeNode) {
		   var treeObj = $.fn.zTree.getZTreeObj("treeDemo1");
			 var nodes = treeObj.getCheckedNodes(true);  
 				
 				$.each(nodes,function(i,v){
 				objval+=v.id+",";
 				});
 				$("#pri_id").val(objval);
 				objval='';
			}; 
		var sObj = $("#" + treeNode.tId + "_span");
		if (treeNode.editNameFlag || $("#addBtn_" + treeNode.tId).length > 0)
			return;
		var addStr = "<span class='button add' id='addBtn_" + treeNode.tId
				+ "' title='add node' onfocus='this.blur();'></span>";
		sObj.after(addStr);
		var btn = $("#addBtn_" + treeNode.tId);
		if (btn)
			btn.bind("click", function() {
				var zTree = $.fn.zTree.getZTreeObj("treeDemo");
				$("#p_id").val(treeNode.id);
				document.getElementById("pform").reset();
				$('#add').removeClass("hide");
				userModel = layer.open({
					type : 1,
					shade : [ 0.5 ],
					title : '添加部门',
					area : [ '35%', '360px' ],
					content : $('#add'), //捕获的元素
					btn : [ '提交', '取消' ],
					yes : function(index, layero) { //或者使用btn1
					var sel=document.getElementById("pri_id").value;
					var str=document.getElementById("str1").value;
					if(sel==""){
						layer.msg("部门权限不能为空！");
					}else{
						$.post("dept/selectdeptnames", {"str":str}, function(data) {
							if(data=="success"){
								$.post("dept/add", $("#pform").serialize(), function(data) {
								layer.close(index);
								$('#add').addClass("hide");
								/* document.getElementById("pform").submit(); */
								});
								location.reload();
							}else{
								layer.msg("该部门已经存在！");
							}
						})
						
					}

					},
					cancel : function(index) {
						layer.close(index);
						$('#add').addClass("hide"); //取消继续隐藏
					},
				});
				/* zTree.addNodes(treeNode, {id:(100 + newCount), pId:treeNode.id, name:"new node" + (newCount++)}); */
				return false;
			});
	};
	function showRemoveBtn(treeId, treeNode) {
		return !treeNode.isParent ;
	}
	function removeHoverDom(treeId, treeNode) {
		$("#addBtn_" + treeNode.tId).unbind().remove();
	};

	
		$.fn.zTree.init($("#treeDemo"), setting, zNodes);
	
	function addqx(id) {
		$("#dept_id").val(id);
		document.getElementById("adx").reset();
		$('#addqx').removeClass("hidden");
		userMode = layer.open({
			type : 1,
			shade : [ 0.5 ],
			title : '权限添加', //不显示标题
			area : [ '20%', '500px' ], //显示空间
			content : $('#addqx'), //捕获的元素
			btn : [ '添加', '取消' ],
			yes : function(index, layero) { //或者使用btn1
				$.post("addqx", $("#adx").serialize(), function(data) {
					layer.close(index);
					$('#addqx').addClass("hidden");
					document.getElementById("adx").submit();
				});
			},
			cancel : function(index) {
				layer.close(index);
				$('#addqx').addClass("hidden"); //取消继续隐藏
			},
		});
	};
	function abclick(id){
	$.post("dept/select", {"id":id}, function(data) {
			pagedemo(1);
		})
	};
	$("#selectfromsb").click(function() {
		$.post("dept/pagedemo",  function(data) {
			packlist(data);
		})
		return false;
	});
</script>